import { Link, useLocation } from 'react-router-dom';

export const App4 = () => {
  // const location2 = useLocation();
  // console.log(location2.state)
  // unknown 类型介绍
  // console.log('=====>', (location2.state as { from: string }).from);

  // 可以进行任意操作，没有安全可言
  // let value: any
  // value = true // 不是字符串
  // value.length // 不检查，不报错
  // let value: unknown;
  // value = 'abcdefg'; // 是字符串
  // console.log((value as string).length); // 检查，报错。提示开发者转化为具体的类型

  // 当前组件渲染后（在页面可以见时），浏览器地址栏里的信息
  const location = useLocation<{ from: string } | undefined>();
  console.log('App4 组件渲染后，地址栏里的信息', location);
  console.log('from', location.state?.from);

  return (
    <div>
      App4
      <Link to={'/app5/123'}>到App5</Link>
    </div>
  );
};
